<template>
    <div class="my-wbox">
        <MySearch :searchData="searchData" @listenClick="listenClick" :isSearch="isSearch"></MySearch>

        <MyTable :tableData="tableData" @listenClick="listenClick">
            <template #default="{ slotData, slotColumn }">
                <span v-if="slotColumn.prop === 'operationType'">
                    {{slotData.operationType == 1?'转移数据':'删除数据'}}
                </span>
            </template>
        </MyTable>
    </div>
</template>
<script setup lang='ts'>
import { FunTime } from '@/global/methods';
import { ParentSearch, ParentTable } from '@/interface';
import { store } from '@/store';
import { ref, reactive } from 'vue'
// 搜索是否触发
const isSearch = ref<boolean>(false)
//封装的搜索
const searchData = reactive<ParentSearch>({
    searchForm: [
        { key: 'daterange', styleType: 'date', label: '操作时间:', labelShow: true, type: 'daterange', format: 'YYYY-MM-DD', value: '', startPlaceholder: "开始时间", endPlaceholder: "结束时间" },
        { key: 'operationType', styleType: 'select', label: '操作方式:', value: '', data: [{ label: '数据转移', value: 1 }, { label: '删除数据', value: 2 }] },
    ],
})

//封装的表格
const tableData = reactive<ParentTable>({//表格的一些数据
    listApi: '/manage/admin/log/pageList',//列表搜索接口
    listHttp: 'post',//列表接口方法
    search: {},//搜索条件
    column: [//表头
        { prop: 'userName', label: '操作人', align: 'left' },
        { prop: 'roleName', label: '操作人角色' },
        { prop: 'operationType', label: '操作方式', slot: true },
        { prop: 'action', label: '操作内容', tooltip: true },
        { prop: 'operationTime', label: '操作时间' }
    ],
    index: true,//true 显示序号
})

//列表搜索
const onSearch = (val: any) => {
    if (val?.daterange?.length > 0) {
        val.startTime = FunTime(val.daterange[0])
        val.endTime = FunTime(val.daterange[1])
    }
    delete val.daterange
    tableData.search = val
    //刷新表格
    store.commit('refresh/setRefresh', !store.getters['refresh/getRefresh'])
}
//列表搜索重置 清空插槽里面的内容
const onSearchClear = (val: any) => {
    onSearch(val)
}

const objFun = {
    'onSearch': onSearch,
    'onSearchClear': onSearchClear,
}
// 监听子级表格  传过来的方法禁用
const listenClick = (name: string, val: any) => {
    objFun[name](val)
}
</script>
<style scoped lang='scss'>

</style>